﻿<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:custom="clr-namespace:SMF.HowTo.Player"
    xmlns:util="clr-namespace:SMF.HowTo.Shared;assembly=SMF.HowTo.Shared"
    xmlns:player="clr-namespace:Microsoft.SilverlightMediaFramework.Player;assembly=Microsoft.SilverlightMediaFramework.Player"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"
    >
    
    
    <Style x:Key="ToggleButtonStyle" TargetType="Button">
        <Setter Property="Background" Value="#FF1F3B53"/>
        <Setter Property="Foreground" Value="#FF000000"/>
        <Setter Property="Padding" Value="3"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="BorderBrush">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFA3AEB9" Offset="0"/>
                    <GradientStop Color="#FF8399A9" Offset="0.375"/>
                    <GradientStop Color="#FF718597" Offset="0.375"/>
                    <GradientStop Color="#FF617584" Offset="1"/>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver"/>
                                <VisualState x:Name="Pressed"/>
                                <VisualState x:Name="Disabled"/>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused"/>
                                <VisualState x:Name="Unfocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border Margin="0" BorderThickness="1" BorderBrush="White" CornerRadius="2">
                            <TextBlock Text="{TemplateBinding Content}" TextWrapping="Wrap" Foreground="White" TextAlignment="Center"/>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
    <Style x:Key="ThumbStyle" TargetType="Thumb">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Grid x:Name="MainLayout" Opacity="0.7">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="00:00:00.3000000"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Focused">
                                    <Storyboard/>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="00:00:00.3000000"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="MainLayout" Storyboard.TargetProperty="(UIElement.Opacity)" To="0.7"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="MainLayout" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/>
                                        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ThumbPartRollover" Storyboard.TargetProperty="(UIElement.Opacity)">
                                            <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0.8"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ThumbPartRollover" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="00:00:00" Value="#B2FFFFFF"/>
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="MainLayout" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/>
                                        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ThumbPartRollover" Storyboard.TargetProperty="(UIElement.Opacity)">
                                            <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0.2"/>
                                        </DoubleAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ThumbPartRollover" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="00:00:00" Value="#B2FFFFFF"/>
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="MainLayout" Storyboard.TargetProperty="(UIElement.Opacity)" To="0.5"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border x:Name="ThumbPart" Cursor="Hand" Background="#FF858585" BorderThickness="1" BorderBrush="#FF212121"/>
                        <Rectangle x:Name="ThumbPartRollover" Fill="#33FFFFFF" Margin="1" Opacity="0"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="custom:HowToPlayer">
        <Setter Property="Background" Value="Black"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="player:Player">
                    <Grid x:Name="PlayerRoot" Height="{TemplateBinding Height}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" Width="{TemplateBinding Width}" Background="{TemplateBinding Background}" d:DesignWidth="640" d:DesignHeight="387">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="00:00:00.4000000"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ControllerContainer" Storyboard.TargetProperty="(UIElement.Opacity)" To="0.65"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="ControllerContainer" Storyboard.TargetProperty="(UIElement.Opacity)" To="1"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentPresenter x:Name="MediaPresenterElement" Grid.Row="0"/>
                        
                        
                        <TextBlock x:Name="BufferingElement" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Collapsed" Grid.Row="0" Foreground="White" Text="Buffering..." d:IsHidden="True"/>
                        <Border x:Name="border" BorderBrush="White" BorderThickness="1,1,0,0" CornerRadius="2" Margin="0,15,0,0" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5">
                            <Grid Margin="0" Background="Black">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="150"/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <Button x:Name="ShowPanelButton" HorizontalAlignment="Left" Margin="5,5,0,0" Content="&gt;" Width="20" Height="20" Style="{StaticResource ToggleButtonStyle}" VerticalAlignment="Top">
                                    <i:Interaction.Triggers>
                                        <i:EventTrigger EventName="Click">
                                            <ic:ChangePropertyAction TargetName="border" PropertyName="RenderTransform" Duration="Automatic">
                                                <ic:ChangePropertyAction.Value>
                                                    <TransformGroup>
                                                        <ScaleTransform/>
                                                        <SkewTransform AngleX="0" AngleY="0"/>
                                                        <RotateTransform Angle="0"/>
                                                        <TranslateTransform X="150"/>
                                                    </TransformGroup>
                                                </ic:ChangePropertyAction.Value>
                                            </ic:ChangePropertyAction>
                                            <ic:ChangePropertyAction TargetName="HidePanelButton" PropertyName="Visibility"/>
                                            <ic:ChangePropertyAction PropertyName="Visibility">
                                                <ic:ChangePropertyAction.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </ic:ChangePropertyAction.Value>
                                            </ic:ChangePropertyAction>
                                        </i:EventTrigger>
                                    </i:Interaction.Triggers>
                                </Button>
                                <Button x:Name="HidePanelButton" HorizontalAlignment="Left" Margin="5,5,0,0" Content="&lt;" Width="20" Height="20" Style="{StaticResource ToggleButtonStyle}" Visibility="Collapsed" VerticalAlignment="Top">
                                    <i:Interaction.Triggers>
                                        <i:EventTrigger EventName="Click">
                                            <ic:ChangePropertyAction TargetName="border" PropertyName="RenderTransform" Duration="Automatic">
                                                <ic:ChangePropertyAction.Value>
                                                    <TransformGroup>
                                                        <ScaleTransform/>
                                                        <SkewTransform AngleX="0" AngleY="0"/>
                                                        <RotateTransform Angle="0"/>
                                                        <TranslateTransform X="0"/>
                                                    </TransformGroup>
                                                </ic:ChangePropertyAction.Value>
                                            </ic:ChangePropertyAction>
                                            <ic:ChangePropertyAction TargetName="ShowPanelButton" PropertyName="Visibility"/>
                                            <ic:ChangePropertyAction PropertyName="Visibility">
                                                <ic:ChangePropertyAction.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </ic:ChangePropertyAction.Value>
                                            </ic:ChangePropertyAction>
                                        </i:EventTrigger>
                                    </i:Interaction.Triggers>
                                </Button>
                                <TextBlock HorizontalAlignment="Left" Text="Select Video" TextWrapping="Wrap" d:LayoutOverrides="Height" Margin="0,30,0,0" Foreground="White" Grid.Column="1" MinWidth="70" Padding="5,0,0,0" FontSize="16"/>
                                <ItemsControl x:Name="VideoInfoList" Margin="15,0,0,0" Grid.Row="1" HorizontalContentAlignment="Left" VerticalContentAlignment="Top" Grid.Column="1" MinWidth="100" VerticalAlignment="Top" HorizontalAlignment="Left">
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <HyperlinkButton util:Click.Command="{Binding SelectedCommand}" Content="{Binding Name, Mode=OneWay}" d:LayoutOverrides="Width, Height" Margin="0,5,0,0"/>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                            </Grid>
                        </Border>
                        <player:CountdownTimeline x:Name="CountdownElement" Visibility="Collapsed" Grid.Row="1"/>
                        <Grid x:Name="ControllerContainer" Grid.Row="1" Height="28">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition x:Name="PlayColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="RewindColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="FastForwardColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="ReplayColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="SlowMotionColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="ChapterMarkerPreviousColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="ChapterMarkerNextColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="PositionColumn" Width="*"/>
                                <ColumnDefinition x:Name="PositionTextColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="GoToLiveColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="BitrateColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="VolumeColumn" Width="Auto"/>
                                <ColumnDefinition x:Name="FullscreenColumn" Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.Background>
                                <LinearGradientBrush StartPoint="0.079977,0.936025" EndPoint="0.079977,-0.0538737">
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStop Color="#FF2E2E2E" Offset="0"/>
                                        <GradientStop Color="#FF272727" Offset="0.5"/>
                                        <GradientStop Color="#FF121212" Offset="1"/>
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Grid.Background>
                            <player:PlayControl x:Name="PlayElement" Grid.Column="0" Margin="0"/>
                            <RepeatButton x:Name="RewindElement" Height="20" Width="20" Grid.Column="1" Margin="0,4,2,4" Visibility="Collapsed" d:IsHidden="True"/>
                            <RepeatButton x:Name="FastFowardElement" Height="20" Width="20" Grid.Column="2" Visibility="Collapsed" Margin="0,4,2,4" d:IsHidden="True"/>
                            <Button x:Name="ReplayElement" Grid.Column="3" BorderThickness="0" Width="28" Height="28" Visibility="Collapsed" d:IsHidden="True"/>
                            <ToggleButton x:Name="SlowMotionElement" Height="20" Width="20" Grid.Column="4" Margin="-1,4,0,4" d:IsHidden="True" Visibility="Collapsed"/>
                            <Button x:Name="ChapterMarkerPreviousElement" Height="20" Width="20" Grid.Column="5" Content="pc" Margin="-1,0,0,0" Visibility="Collapsed" d:IsHidden="True"/>
                            <Button x:Name="ChapterMarkerNextElement" Height="20" Width="20" Grid.Column="6" Content="nc" Margin="-1,0,0,0" Visibility="Collapsed" d:IsHidden="True"/>
                            <player:Scrubber x:Name="PositionElement" Margin="8,2,8,2" VerticalAlignment="Center" Grid.Column="7" AvailableVisibility="Visible">
                                <player:Scrubber.Template>
                                    <ControlTemplate TargetType="player:Scrubber">
                                        <Grid x:Name="MainLayout">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualStateGroup.Transitions>
                                                        <VisualTransition GeneratedDuration="0:0:0.25"/>
                                                    </VisualStateGroup.Transitions>
                                                    <VisualState x:Name="Normal"/>
                                                    <VisualState x:Name="MouseOver"/>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0" Storyboard.TargetName="MainLayout" Storyboard.TargetProperty="(UIElement.Opacity)" To="0.5"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="FocusStates">
                                                    <VisualStateGroup.Transitions>
                                                        <VisualTransition GeneratedDuration="0:0:0.25"/>
                                                    </VisualStateGroup.Transitions>
                                                    <VisualState x:Name="Unfocused"/>
                                                    <VisualState x:Name="Focused">
                                                        <Storyboard/>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Grid x:Name="HorizontalTemplate">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="Auto"/>
                                                    <ColumnDefinition Width="Auto"/>
                                                    <ColumnDefinition Width="*"/>
                                                </Grid.ColumnDefinitions>
                                                <Border x:Name="HorizontalAvailableBar" Height="6" HorizontalAlignment="Left" Visibility="{TemplateBinding AvailableVisibility}" Grid.Column="0" Grid.ColumnSpan="3" BorderThickness="0" CornerRadius="3,3,3,3">
                                                    <Border.Background>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="#FFF93E00"/>
                                                            <GradientStop Color="#FF932500" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </Border.Background>
                                                </Border>
                                                <RepeatButton x:Name="HorizontalTrackLargeChangeDecreaseRepeatButton" IsTabStop="False" Grid.Column="0">
                                                    <RepeatButton.Template>
                                                        <ControlTemplate>
                                                            <Border Height="6" Grid.Column="0" Grid.ColumnSpan="3" BorderBrush="#FF858585">
                                                                <Border.Background>
                                                                    <LinearGradientBrush StartPoint="0.347118,0.0932996" EndPoint="0.347118,0.92265">
                                                                        <LinearGradientBrush.GradientStops>
                                                                            <GradientStop Color="#FF50B9FF"/>
                                                                            <GradientStop Color="#FF00497A" Offset="1"/>
                                                                        </LinearGradientBrush.GradientStops>
                                                                    </LinearGradientBrush>

                                                                </Border.Background>
                                                            </Border>
                                                        </ControlTemplate>
                                                    </RepeatButton.Template>
                                                </RepeatButton>
                                                <Thumb x:Name="HorizontalThumb" Height="14" HorizontalAlignment="Left" Style="{StaticResource ThumbStyle}" Width="7" Background="#00FFFFFF" Grid.Column="1"/>
                                                <RepeatButton x:Name="HorizontalTrackLargeChangeIncreaseRepeatButton" Grid.Column="2">
                                                    <RepeatButton.Template>
                                                        <ControlTemplate>
                                                            <Border Height="6" Grid.Column="0" Grid.ColumnSpan="3" BorderThickness="0">
                                                                <Border.Background>
                                                                    <LinearGradientBrush StartPoint="0.756383,0.125199" EndPoint="0.756383,0.890751">
                                                                        <LinearGradientBrush.GradientStops>
                                                                            <GradientStop Color="#FF000000" Offset="0"/>
                                                                            <GradientStop Color="#FF232323" Offset="0.32"/>
                                                                            <GradientStop Color="#FF464646" Offset="1"/>
                                                                        </LinearGradientBrush.GradientStops>
                                                                    </LinearGradientBrush>

                                                                </Border.Background>
                                                            </Border>
                                                        </ControlTemplate>
                                                    </RepeatButton.Template>
                                                </RepeatButton>
                                                <ItemsControl x:Name="MarkersElement" Grid.Column="0" Grid.ColumnSpan="3">
                                                    <ItemsControl.ItemTemplate>
                                                        <DataTemplate>
                                                            <player:MarkerControl HorizontalAlignment="Left" VerticalAlignment="Top">
                                                                <player:MarkerControl.Template>
                                                                    <ControlTemplate TargetType="player:MarkerControl">
                                                                        <Grid>
                                                                            <VisualStateManager.VisualStateGroups>
                                                                                <VisualStateGroup x:Name="CommonStates">
                                                                                    <VisualState x:Name="Normal">
                                                                                        <Storyboard>
                                                                                            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Visibility)">
                                                                                                <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                                                                    <DiscreteObjectKeyFrame.Value>
                                                                                                        <Visibility>Collapsed</Visibility>
                                                                                                    </DiscreteObjectKeyFrame.Value>
                                                                                                </DiscreteObjectKeyFrame>
                                                                                            </ObjectAnimationUsingKeyFrames>
                                                                                        </Storyboard>
                                                                                    </VisualState>
                                                                                    <VisualState x:Name="StateMouseOver">
                                                                                        <Storyboard>
                                                                                            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Visibility)">
                                                                                                <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                                                                    <DiscreteObjectKeyFrame.Value>
                                                                                                        <Visibility>Visible</Visibility>
                                                                                                    </DiscreteObjectKeyFrame.Value>
                                                                                                </DiscreteObjectKeyFrame>
                                                                                            </ObjectAnimationUsingKeyFrames>
                                                                                        </Storyboard>
                                                                                    </VisualState>
                                                                                </VisualStateGroup>
                                                                            </VisualStateManager.VisualStateGroups>
                                                                            <Canvas Width="5" Height="15">
                                                                                <Border HorizontalAlignment="Left" VerticalAlignment="Top" Width="5" Height="15" BorderThickness="0" Background="#FFF3FF06"/>
                                                                                <Grid x:Name="grid" Height="20" RenderTransformOrigin="0.5,0.5" Visibility="Collapsed" Background="#FFF3FF06" d:LayoutOverrides="HorizontalAlignment, VerticalAlignment, Height, VerticalMargin">
                                                                                    <Grid.RenderTransform>
                                                                                        <TransformGroup>
                                                                                            <ScaleTransform/>
                                                                                            <SkewTransform/>
                                                                                            <RotateTransform/>
                                                                                            <TranslateTransform Y="-28"/>
                                                                                        </TransformGroup>
                                                                                    </Grid.RenderTransform>
                                                                                    <TextBlock Margin="2" VerticalAlignment="Center" FontSize="10.667" Text="{Binding Description, Mode=OneWay}" TextWrapping="Wrap" d:LayoutOverrides="Width, Height" HorizontalAlignment="Center"/>
                                                                                </Grid>
                                                                            </Canvas>
                                                                        </Grid>
                                                                    </ControlTemplate>
                                                                </player:MarkerControl.Template>
                                                            </player:MarkerControl>
                                                        </DataTemplate>
                                                    </ItemsControl.ItemTemplate>
                                                    <ItemsControl.ItemsPanel>
                                                        <ItemsPanelTemplate>
                                                            <player:MarkerItemsPanel ThumbWidth="{Binding Width, ElementName=HorizontalThumb}"/>
                                                        </ItemsPanelTemplate>
                                                    </ItemsControl.ItemsPanel>
                                                </ItemsControl>
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>
                                </player:Scrubber.Template>
                            </player:Scrubber>
                            <Border x:Name="TimeContainer" Grid.Column="8" BorderBrush="#FF434343" BorderThickness="1">
                                <Border.Background>
                                    <LinearGradientBrush StartPoint="0.568682,0.0606061" EndPoint="0.568682,0.959596">
                                        <GradientStop Color="#FF2E2E2E" Offset="0"/>
                                        <GradientStop Color="#FF040404" Offset="1"/>
                                    </LinearGradientBrush>

                                </Border.Background>
                                <Grid>
                                    <TextBlock x:Name="CurrentTimeElement" FontSize="9" Foreground="#FFC1C1C1" VerticalAlignment="Center" TextAlignment="Center" d:LayoutOverrides="Width" Margin="8,0"/>
                                    <TextBlock x:Name="TimeSeparatorElement" Margin="0,0,-5,0" FontSize="9" Foreground="#ffc0c0c0" Text="|" Visibility="Collapsed" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                                    <TextBlock x:Name="TotalTimeElement" FontSize="9" Foreground="#ffc0c0c0" Visibility="Collapsed" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                                </Grid>
                            </Border>
                            <ToggleButton x:Name="GoToLiveElement" Height="20" Width="20" Grid.Column="9" Visibility="Collapsed"/>
                            <player:Bitrate x:Name="BitrateElement" Height="20" Width="20" Grid.Column="10" Visibility="Collapsed"/>
                            <Grid x:Name="VolumeExtendWraper" Height="150" Margin="-1,-150,-1,0" VerticalAlignment="Bottom" Grid.Column="11" Width="28">
                                <player:VolumeControl x:Name="VolumeElement" HorizontalAlignment="Center" VolumeLevel=".5" Width="28" VerticalAlignment="Bottom"/>
                            </Grid>
                            <ToggleButton x:Name="FullScreenElement" Grid.Column="12" BorderThickness="0" HorizontalContentAlignment="Stretch" Padding="0" VerticalContentAlignment="Stretch"/>
                            <Rectangle x:Name="DividerStoke" Fill="#FF585858" Stroke="Black" Grid.ColumnSpan="13" StrokeThickness="0" VerticalAlignment="Top" Height="1"/>
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    
</ResourceDictionary>
